<template>
  <div class="itliuyang w-full pt-16">
    <Title>首页</Title>
    <!-- 背景 -->
    <div id="background" class="fixed">
       <div class="image"></div>
      <l-plum></l-plum>
    </div>
    <!-- 顶部 -->
    <CHeader></CHeader>
    <!-- 内容 -->
    <section class=" " @click.stop="onClick">
      <div
        class="w-full h-full absolute info-bg z-10"
        v-if="menuStore.menuVisible"
      ></div>
      <slot />
    </section>

    <c-footer></c-footer>
  </div>
</template>
<script lang="ts" setup>
const menuStore = useMenuStore();

const onClick = () => {
  if (menuStore.menuVisible) {
    document.documentElement.style.overflow = "auto";
    menuStore.hide();
  }
};

const mounted = () => {
  window.addEventListener("resize", function () {
    if (document.body.offsetWidth > 500) {
      // 收起菜单
      menuStore.hide();
    }
  });
  onClick();
};

onMounted(mounted);

</script>
